import React, { Component } from "react"
import { connect } from 'react-redux'
import { Button, Form, Input, Switch, message } from 'antd'
import constant from "containers/finance-setting/loan-setting/constant"
import exportService from './export-service'
import Chooser from "components/chooser"
import { messages } from "share/common"

@connect(mapStateToProps)
@Form.create()
class ExportRule extends Component {

  state = {
    saveLoading: false
  };

  handleSave = () => {
    this.props.form.validateFieldsAndScroll((err, value) => {
      if (!err) {
        const { record } = this.props.params, { close, tenant } = this.props;
        this.setState({ saveLoading: true });
        value.isPreset = false;
        value.tenantId = tenant.id;
        exportService.saveOrUpdate(Object.assign(record, value)).then(() => {
          this.setState({ saveLoading: false }, () => {
            message.success(messages('common.operate.success')/*操作成功*/);
            close(true);
          });
        }).catch(e => {
          this.setState({ saveLoading: false });
          message.error(e.response.data.message)
        })
      }
    })
  };

  render() {
    const { formItemLayout } = constant;
    const { saveLoading } = this.state;
    const { close } = this.props, { record } = this.props.params;
    const { getFieldDecorator } = this.props.form;
    return (
      <div>
        <Form className={'new-form'}>
          <Form.Item
            label={messages('common.column.status')/*状态*/}
            {...formItemLayout}
          >
            {getFieldDecorator("isEnabled", {
              rules: [{ required: true }],
              valuePropName: "checked",
              initialValue: record.hasOwnProperty('isEnabled') ? record.isEnabled : true
            })(
              <Switch>{messages('finance-4.key344')/*启用temp*/}</Switch>
            )}
          </Form.Item>
          <Form.Item
            label={messages('finance-4.key398')/*报盘文件模版编码*/}
            {...formItemLayout}
          >
            {getFieldDecorator('templateCode',{
              rules: [
                { required: true, message: messages('common.please.input')/*请输入*/ },
                {
                  pattern: /^[0-9A-Za-z_-]{0,50}$/,
                  message: messages('finance-4.key404')/*只能输入字母 数字 _ -*/
                }
              ],
              initialValue: record.templateCode
            })(
              <Input placeholder={messages('common.please.input')/*请输入*/}/>
            )}
          </Form.Item>
          <Form.Item
            label={messages('finance-4.key405')/*报盘文件模名称*/}
            {...formItemLayout}
          >
            {getFieldDecorator('templateName',{
              rules: [
                { required: true, message: messages('common.please.input')/*请输入*/ }
              ],
              initialValue: record.templateName
            })(
              <Input placeholder={messages('common.please.input')/*请输入*/}/>
            )}
          </Form.Item>
          <Form.Item
            label={messages('finance-4.key400')/*分配银行*/}
            {...formItemLayout}
          >
            {getFieldDecorator('bankName',{
              rules: [
                { required: true, message: messages('common.select')/*请选择*/ }
              ],
              initialValue: record.hasOwnProperty('bankName') ? [{messageKey: record.bankName}] : undefined
            })(
              <Chooser
                selectorItem={{
                  title: messages('finance-4.key23')/*选择银行*/,
                  url: `/api/custom/enumerations/template/by/type/page`,
                  searchForm: [{
                    type: 'input', id: 'keyword', label: messages('finance-4.key22')/*银行名称*/
                  }],
                  columns: [{
                    title: messages('finance-4.key22')/*银行名称*/, dataIndex: 'messageKey'
                  }],
                  key: 'messageKey'
                }}
                valueKey="messageKey"
                onlyNeed="messageKey"
                labelKey="messageKey"
                listExtraParams={{ type: '1004' }}
                single
              />
            )}
          </Form.Item>
          <div className='footer-operate'>
            <Button type='primary' onClick={this.handleSave} loading={saveLoading}>{messages('common.ok')/*确定*/}</Button>
            <Button onClick={() => close()}>{messages('common.cancel')/*取消*/}</Button>
          </div>
        </Form>
      </div>
    )
  }

}

function mapStateToProps (state) {
  return ({
    tenant: state.login.tenant
  })
}

export default ExportRule
